<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    Vue 3 是 Vue.js 框架的第三个主要版本，它是一个用于构建用户界面的渐进式 JavaScript 框架。
    Vue 3 在 Vue 2 的基础上进行了全面升级，带来了许多新特性和性能优化。以下为你介绍它的一些关键信息：
新特性

组合式 API：这是 Vue 3 的核心特性之一。它让你可以使用函数的方式来组织组件逻辑，
能更好地复用和管理代码。相较于 Vue 2 的选项式 API，组合式 API 让代码结构更清晰，
特别是在处理复杂组件时优势明显。
Suspense 组件：它能够处理异步依赖，比如异步组件或者异步数据获取。
这让你可以在等待异步操作完成时显示加载状态，提升用户体验。
Teleport 组件：它可以将组件内容渲染到 DOM 中的其他位置，而不必改变组件的逻辑结构
在创建模态框、提示框这类需要脱离当前组件层级渲染的元素时非常有用。
自定义渲染器：Vue 3 允许开发者创建自定义渲染器，将 Vue 组件渲染到不同的目标上，
例如 WebGL、Canvas 或者原生移动应用等。
性能优化
Proxy 响应式系统：Vue 3 采用了 ES6 的 Proxy 对象来实现响应式系统，相较于 Vue 2 的 Object.defineProperty
，它能更好地检测对象属性的新增和删除，并且对数组的操作支持更完善。
编译优化：Vue 3 的编译器进行了大量优化，生成的渲染函数更小、更快。
它能够静态分析模板，标记出静态节点，避免在每次渲染时重复处理这些节点，从而提高渲染性能。
<script>
    // Vue 3 的基本用法
    import { createApp } from 'vue'
    const app = createApp({
        data() {
            return {
                message: 'Hello Vue 3!'
            }
        }
    })
    app.mount('#app')

</script>
</body>
</html>